<template>
	<view class="">
		<NavBar :title="orderDetail.orderStatus" :isShowLeftBtn="true">
		</NavBar>
	</view>
	<view class="content" :style="{minHeight:contentHeight}" v-if="isPageShow">
		<view class="main">
			<view class="main_sec m_b_90">
				<view class="m_b_42" style="text-align: center;">
					<text class="f_30_0_b">
						{{orderDetail.orderStatus}}
					</text>
				</view>
				<view class="m_b_12">
					<view class="" style="width: 620rpx;">
						<text class="f_26_0 u-line-1">
							订单编号：{{orderDetail.order_no}}
						</text>
					</view>
					<view class="" style="width: 620rpx;">
						<text class="f_26_0">
							送货地址：{{orderDetail.delivery_address}}
						</text>
					</view>
					<view class="" style="width: 620rpx;">
						<text class="f_26_0 u-line-1">
							收货联系人：{{orderDetail.contact_name}}
						</text>
					</view>
					<view class="" style="width: 620rpx;">
						<text class="f_26_0 u-line-1">
							联系电话：{{orderDetail.contact_phone}}
						</text>
					</view>
				</view>
				<view class="sec_detail m_b_20">
					<view class="m_b_10">
						<text class="f_26_0 ">
							询价确认单明细：
						</text>
					</view>
					<view class="m_t_30" v-for="(item,index) in orderDetail.goods" :key="index">
						<view class="flex_both">
							<view class="" style="width: 300rpx; flex-shrink: 0;">
								<text class="f_26_0 u-line-1">
									名称：{{item.name}}
								</text>
							</view>
							<view class="" style="width: 300rpx; flex-shrink: 0;">
								<text class="f_26_0">
									型号：{{item.model}}
								</text>
							</view>
						</view>
						<view class="" style="width: 300rpx; flex-shrink: 0;">
							<text class="f_26_0">
								数量：{{item.num}}
							</text>
						</view>
						<!-- <view class="" style="width: 300rpx; flex-shrink: 0;">
							<text class="f_26_0 u-line-1">
								指导单价：{{item.price}}
							</text>
						</view> -->
						<view class="flex m_t_20 m_b_20" style="align-items: flex-start; ">
							<view class="m_r_10" style="width: 300rpx; flex-shrink: 0;">
								<up-image :show-loading="true" :src="item.images" width="190rpx" height="174rpx"
									radius="5" @click="previewImage(item.images,index)"></up-image>
							</view>
							<view class="" style="width: 300rpx;flex-shrink: 0;">
								<text class="f_26_0 ">
									技术参数：{{item.desc}}
								</text>
							</view>
						</view>
						<view class="form_box m_t_10 m_b_10 flex">
							<view class="">
								<text class="f_26_0">
									询价价格：
								</text>
							</view>
							<view class="form_item form_input" style="width: 60%;">
								<up-input v-model="item.price_ask" placeholder="请输入询价价格" border="none"
									fontSize="26rpx"></up-input>
							</view>
						</view>
						<!-- <view class="" style="width: 600rpx;">
							<text class="f_26_0  u-line-1">
								总价：{{item.total}}
							</text>
						</view> -->
					</view>
				</view>
				<!-- <view class="m_b_16">
					<view class="" style="width: 620rpx;">
						<text class="f_26_0 u-line-1">
							订单总价：{{orderDetail.total_price}}
						</text>
					</view>
				</view> -->
				<view class="hr m_t_20 m_b_14">

				</view>
				<view class="">
					<text class="f_26_0" style="color: #3665FF;">
						{{orderDetail.orderStatus}}
					</text>
				</view>
				<view class="">
					
					<text class="f_26_0" style="color: #8C8E91;">
						下单日期：{{orderDetail.create_time}}
					</text>
				</view>
			</view>
			<view class="submit_btn">
				<up-button throttleTime="1000" @click="onComplete">
					<text class="f_28_f">
						询价订单确认
					</text>
				</up-button>
			</view>
		</view>
	</view>
</template>
<script setup lang="ts">
	import { ref, reactive, getCurrentInstance } from "vue";
	import { onLoad, onShow } from "@dcloudio/uni-app";
	import NavBar from "@/components/navbar.vue"
	const { proxy } = getCurrentInstance()
	const contentHeight = ref('100vh')
	const statusBarHeight = ref(88)
	const oId = ref()
	const isPageShow = ref(false)
	onLoad((e) => {
		uni.getSystemInfo({
			success: function (info) {
				statusBarHeight.value = (info.statusBarHeight + 44) * 2
				contentHeight.value = `calc(100vh - ${statusBarHeight.value + 100}rpx)`
			}
		});
		oId.value = e.id
		getOrderDetail()
	})
	const orderDetail = ref({ orderStatus: '' })
	const getOrderDetail = async () => {
		let res = await proxy.$http('salesMan.getOrderDetail', { order_id: oId.value })
		if (res.code == 1) {
			orderDetail.value = res.data
			isPageShow.value = true
		}
	}
	const onComplete = () => {
		cgDeal1()
	}
	const cgDeal1 = () => {
		let params = {
			order_id: orderDetail.value.id,
			goods: []
		}
		orderDetail.value.goods.forEach(v => {
			params.goods.push({
				price_ask: v.price_ask,
				id: v.id
			})
		})
		let flag = false
		params.goods.forEach(v => {
			if (!v.price_ask) {
				flag = true
			}
		})
		if (flag) {
			uni.$u.toast('价格不能为空')
			return
		}
		uni.request({
			url: proxy.$config.baseUrl + '/Api/Order/cgDeal1',
			data: params,
			method: "POST",
			header: {
				'content-type': "application/json",
				token: uni.getStorageSync('token')
			},
			success: function (res) {
				if (res.data.code == 1) {
					uni.showToast({
						title: "提交成功",
						icon: 'success'
					})
					setTimeout(() => {
						uni.navigateBack(1)
					}, 800)
				} else {
					uni.$u.toast(res.data.msg)
				}
			},
			fail: function (err) {
				console.error(err);
			},
			complete() {

			}
		});
	}
	const previewImage = (e, index) => {
		uni.previewImage({
			urls: [e], //需要预览的图片http链接列表，多张的时候，url直接写在后面就行了
			current: index, // 当前显示图片的http链接，默认是第一个
			success: function (res) { },
			fail: function (res) { },
			complete: function (res) { },
		})
	};
</script>
<style lang="scss" scoped>
	.content {
		background: #F2F2F2;
		padding: 32rpx 20rpx;
		padding-bottom: 64rpx;

		.main {
			.main_sec {
				width: 654rpx;
				padding: 28rpx;
				padding-top: 40rpx;
				background: #FFFFFF;
				box-shadow: 2rpx 6rpx 5rpx 0rpx rgba(197, 197, 197, 0.29);
				border-radius: 10rpx;
				border: 1px solid #EDEDEE;

				.sec_detail {
					width: 626rpx;
					padding: 20rpx;
					background: #F6F8FE;
					border-radius: 5rpx;
				}
			}
		}

	}

	.form_box {
		.form_input {
			width: 564rpx;
			height: 80rpx;
			padding: 0 22rpx;
			background: #FFFFFF;
			border-radius: 10rpx;
			border: 1px solid #EDEDEE;
			display: flex;
			align-items: center;
		}
	}
</style>